<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=EDGE">
    <title>Class: Map</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
    <link type="text/css" rel="stylesheet" href="styles/custom.css">
    <!--[if lt IE 9]>
    <script src="scripts/html5shiv.min.js"></script>
    <script src="scripts/respond.min.js"></script>
    <![endif]-->
</head>

<body>

<div style="position:fixed;top:0px;left:0px;"><h1 class="page-title">Class: Map</h1></div>
<div id="main" style="margin-top:77px;">
    





<nav class="classnav scroll-styled">

    <h5><a href="#main" style="color:#000">class : Map</a></h5>
    
        <h5>Members</h5>
        <ul>
        
            <li><a href="#options">options</a></li>
        
            <li><a href="#VERSION">VERSION</a></li>
        
            <li><a href="#JSON_VERSION">JSON_VERSION</a></li>
        
        </ul>
    

    

        
            
            
            <h5>Static Methods</h5>
            <ul>
            
            
                <li><a href="#.addOnLoadHook">
            
                addOnLoadHook</a></li>
        
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
                <li><a href="#.fromJSON">
            
                fromJSON</a></li>
        
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
        
            </ul>
        
        <h5>Methods</h5>
        <ul>
        
            
                <li><a href="#isLoaded">
            
                isLoaded</a></li>
        
            
                <li><a href="#getContainer">
            
                getContainer</a></li>
        
            
                <li><a href="#getSpatialReference">
            
                getSpatialReference</a></li>
        
            
                <li><a href="#setSpatialReference">
            
                setSpatialReference</a></li>
        
            
                <li><a href="#getProjection">
            
                getProjection</a></li>
        
            
                <li><a href="#getFullExtent">
            
                getFullExtent</a></li>
        
            
                <li><a href="#setCursor">
            
                setCursor</a></li>
        
            
                <li><a href="#resetCursor">
            
                resetCursor</a></li>
        
            
                <li><a href="#getCenter">
            
                getCenter</a></li>
        
            
                <li><a href="#setCenter">
            
                setCenter</a></li>
        
            
                <li><a href="#getSize">
            
                getSize</a></li>
        
            
                <li><a href="#getContainerExtent">
            
                getContainerExtent</a></li>
        
            
                <li><a href="#getExtent">
            
                getExtent</a></li>
        
            
                <li><a href="#getProjExtent">
            
                getProjExtent</a></li>
        
            
                <li><a href="#getPrjExtent">
            
                getPrjExtent</a></li>
        
            
                <li><a href="#getMaxExtent">
            
                getMaxExtent</a></li>
        
            
                <li><a href="#setMaxExtent">
            
                setMaxExtent</a></li>
        
            
                <li><a href="#getZoom">
            
                getZoom</a></li>
        
            
                <li><a href="#getZoomForScale">
            
                getZoomForScale</a></li>
        
            
                <li><a href="#setZoom">
            
                setZoom</a></li>
        
            
                <li><a href="#getMaxZoom">
            
                getMaxZoom</a></li>
        
            
                <li><a href="#setMaxZoom">
            
                setMaxZoom</a></li>
        
            
                <li><a href="#getMinZoom">
            
                getMinZoom</a></li>
        
            
                <li><a href="#setMinZoom">
            
                setMinZoom</a></li>
        
            
                <li><a href="#getMaxNativeZoom">
            
                getMaxNativeZoom</a></li>
        
            
                <li><a href="#getGLZoom">
            
                getGLZoom</a></li>
        
            
                <li><a href="#getGLScale">
            
                getGLScale</a></li>
        
            
                <li><a href="#zoomIn">
            
                zoomIn</a></li>
        
            
                <li><a href="#zoomOut">
            
                zoomOut</a></li>
        
            
                <li><a href="#isZooming">
            
                isZooming</a></li>
        
            
                <li><a href="#isInteracting">
            
                isInteracting</a></li>
        
            
                <li><a href="#setCenterAndZoom">
            
                setCenterAndZoom</a></li>
        
            
                <li><a href="#getFitZoom">
            
                getFitZoom</a></li>
        
            
                <li><a href="#getView">
            
                getView</a></li>
        
            
                <li><a href="#setView">
            
                setView</a></li>
        
            
                <li><a href="#getResolution">
            
                getResolution</a></li>
        
            
                <li><a href="#getScale">
            
                getScale</a></li>
        
            
                <li><a href="#fitExtent">
            
                fitExtent</a></li>
        
            
                <li><a href="#getBaseLayer">
            
                getBaseLayer</a></li>
        
            
                <li><a href="#setBaseLayer">
            
                setBaseLayer</a></li>
        
            
                <li><a href="#removeBaseLayer">
            
                removeBaseLayer</a></li>
        
            
                <li><a href="#getLayers">
            
                getLayers</a></li>
        
            
                <li><a href="#getLayer">
            
                getLayer</a></li>
        
            
                <li><a href="#addLayer">
            
                addLayer</a></li>
        
            
                <li><a href="#removeLayer">
            
                removeLayer</a></li>
        
            
                <li><a href="#sortLayers">
            
                sortLayers</a></li>
        
            
                <li><a href="#toDataURL">
            
                toDataURL</a></li>
        
            
                <li><a href="#coordToPoint">
            
                coordToPoint</a></li>
        
            
                <li><a href="#pointToCoord">
            
                pointToCoord</a></li>
        
            
                <li><a href="#coordToViewPoint">
            
                coordToViewPoint</a></li>
        
            
                <li><a href="#viewPointToCoord">
            
                viewPointToCoord</a></li>
        
            
                <li><a href="#coordToContainerPoint">
            
                coordToContainerPoint</a></li>
        
            
                <li><a href="#containerPointToCoord">
            
                containerPointToCoord</a></li>
        
            
                <li><a href="#containerPointToViewPoint">
            
                containerPointToViewPoint</a></li>
        
            
                <li><a href="#viewPointToContainerPoint">
            
                viewPointToContainerPoint</a></li>
        
            
                <li><a href="#checkSize">
            
                checkSize</a></li>
        
            
                <li><a href="#locate">
            
                locate</a></li>
        
            
                <li><a href="#getMainPanel">
            
                getMainPanel</a></li>
        
            
                <li><a href="#getPanels">
            
                getPanels</a></li>
        
            
                <li><a href="#remove">
            
                remove</a></li>
        
            
                <li><a href="#isRemoved">
            
                isRemoved</a></li>
        
            
                <li><a href="#isMoving">
            
                isMoving</a></li>
        
            
                <li><a href="#getDevicePixelRatio">
            
                getDevicePixelRatio</a></li>
        
            
                <li><a href="#offsetPlatform">
            
                offsetPlatform</a></li>
        
            
                <li><a href="#getViewPoint">
            
                getViewPoint</a></li>
        
            
                <li><a href="#coordinateToPoint">
            
                coordinateToPoint</a></li>
        
            
                <li><a href="#pointToCoordinate">
            
                pointToCoordinate</a></li>
        
            
                <li><a href="#coordinateToViewPoint">
            
                coordinateToViewPoint</a></li>
        
            
                <li><a href="#viewPointToCoordinate">
            
                viewPointToCoordinate</a></li>
        
            
                <li><a href="#coordinateToContainerPoint">
            
                coordinateToContainerPoint</a></li>
        
            
                <li><a href="#containerPointToCoordinate">
            
                containerPointToCoordinate</a></li>
        
            
                <li><a href="#containerToExtent">
            
                containerToExtent</a></li>
        
            
                <li><a href="#distanceToPixel">
            
                distanceToPixel</a></li>
        
            
                <li><a href="#distanceToPoint">
            
                distanceToPoint</a></li>
        
            
                <li><a href="#pixelToDistance">
            
                pixelToDistance</a></li>
        
            
                <li><a href="#pointToDistance">
            
                pointToDistance</a></li>
        
            
                <li><a href="#locateByPoint">
            
                locateByPoint</a></li>
        
            
                <li><a href="#_pointToExtent">
            
                _pointToExtent</a></li>
        
            
                <li><a href="#animateTo">
            
                animateTo</a></li>
        
            
                <li><a href="#isAnimating">
            
                isAnimating</a></li>
        
            
                <li><a href="#getFov">
            
                getFov</a></li>
        
            
                <li><a href="#setFov">
            
                setFov</a></li>
        
            
                <li><a href="#getBearing">
            
                getBearing</a></li>
        
            
                <li><a href="#setBearing">
            
                setBearing</a></li>
        
            
                <li><a href="#getPitch">
            
                getPitch</a></li>
        
            
                <li><a href="#setPitch">
            
                setPitch</a></li>
        
            
                <li><a href="#isFullScreen">
            
                isFullScreen</a></li>
        
            
                <li><a href="#requestFullScreen">
            
                requestFullScreen</a></li>
        
            
                <li><a href="#cancelFullScreen">
            
                cancelFullScreen</a></li>
        
            
                <li><a href="#panTo">
            
                panTo</a></li>
        
            
                <li><a href="#panBy">
            
                panBy</a></li>
        
            
                <li><a href="#toJSON">
            
                toJSON</a></li>
        
            
                <li><a href="#computeLength">
            
                computeLength</a></li>
        
            
                <li><a href="#computeGeometryLength">
            
                computeGeometryLength</a></li>
        
            
                <li><a href="#computeGeometryArea">
            
                computeGeometryArea</a></li>
        
            
                <li><a href="#identify">
            
                identify</a></li>
        
            
                <li><a href="#zoomToPreviousView">
            
                zoomToPreviousView</a></li>
        
            
                <li><a href="#hasPreviousView">
            
                hasPreviousView</a></li>
        
            
                <li><a href="#zoomToNextView">
            
                zoomToNextView</a></li>
        
            
                <li><a href="#hasNextView">
            
                hasNextView</a></li>
        
            
                <li><a href="#getViewHistory">
            
                getViewHistory</a></li>
        
            
                <li><a href="#addControl">
            
                addControl</a></li>
        
            
                <li><a href="#removeControl">
            
                removeControl</a></li>
        
            
                <li><a class="mixed" href="#on">
            
                on</a></li>
        
            
                <li><a class="mixed" href="#addEventListener">
            
                addEventListener</a></li>
        
            
                <li><a class="mixed" href="#once">
            
                once</a></li>
        
            
                <li><a class="mixed" href="#off">
            
                off</a></li>
        
            
                <li><a class="mixed" href="#removeEventListener">
            
                removeEventListener</a></li>
        
            
                <li><a class="mixed" href="#listens">
            
                listens</a></li>
        
            
                <li><a class="mixed" href="#copyEventListeners">
            
                copyEventListeners</a></li>
        
            
                <li><a class="mixed" href="#fire">
            
                fire</a></li>
        
            
                <li><a class="mixed" href="#setMenu">
            
                setMenu</a></li>
        
            
                <li><a class="mixed" href="#openMenu">
            
                openMenu</a></li>
        
            
                <li><a class="mixed" href="#setMenuItems">
            
                setMenuItems</a></li>
        
            
                <li><a class="mixed" href="#getMenuItems">
            
                getMenuItems</a></li>
        
            
                <li><a class="mixed" href="#closeMenu">
            
                closeMenu</a></li>
        
            
                <li><a class="mixed" href="#removeMenu">
            
                removeMenu</a></li>
        
            
                <li><a class="mixed" href="#registerRenderer">
            
                registerRenderer</a></li>
        
            
                <li><a class="mixed" href="#getRendererClass">
            
                getRendererClass</a></li>
        
            
                <li><a class="inherit" href="#callInitHooks">
            
                callInitHooks</a></li>
        
            
                <li><a class="inherit" href="#setOptions">
            
                setOptions</a></li>
        
            
                <li><a class="inherit" href="#config">
            
                config</a></li>
        
        </ul>
    

    
        <h5>Events</h5>
        <ul>
        
            <li><a href="#event:spatialreferencechange">spatialreferencechange</a></li>
        
            <li><a href="#event:baselayerchangestart">baselayerchangestart</a></li>
        
            <li><a href="#event:baselayerchangeend">baselayerchangeend</a></li>
        
            <li><a href="#event:setbaselayer">setbaselayer</a></li>
        
            <li><a href="#event:baselayerload">baselayerload</a></li>
        
            <li><a href="#event:baselayerremove">baselayerremove</a></li>
        
            <li><a href="#event:addlayer">addlayer</a></li>
        
            <li><a href="#event:removelayer">removelayer</a></li>
        
            <li><a href="#event:resize">resize</a></li>
        
            <li><a href="#event:movestart">movestart</a></li>
        
            <li><a href="#event:moving">moving</a></li>
        
            <li><a href="#event:moveend">moveend</a></li>
        
            <li><a href="#event:dragrotatestart">dragrotatestart</a></li>
        
            <li><a href="#event:dragrotating">dragrotating</a></li>
        
            <li><a href="#event:dragrotateend">dragrotateend</a></li>
        
            <li><a href="#event:animating">animating</a></li>
        
            <li><a href="#event:animateinterrupted">animateinterrupted</a></li>
        
            <li><a href="#event:animateend">animateend</a></li>
        
            <li><a href="#event:animatestart">animatestart</a></li>
        
            <li><a href="#event:pitch">pitch</a></li>
        
            <li><a href="#event:pitchend">pitchend</a></li>
        
            <li><a href="#event:mousedown">mousedown</a></li>
        
            <li><a href="#event:mouseup">mouseup</a></li>
        
            <li><a href="#event:mouseover">mouseover</a></li>
        
            <li><a href="#event:mouseout">mouseout</a></li>
        
            <li><a href="#event:mouseenter">mouseenter</a></li>
        
            <li><a href="#event:mouseleave">mouseleave</a></li>
        
            <li><a href="#event:mousemove">mousemove</a></li>
        
            <li><a href="#event:click">click</a></li>
        
            <li><a href="#event:dblclick">dblclick</a></li>
        
            <li><a href="#event:contextmenu">contextmenu</a></li>
        
            <li><a href="#event:keypress">keypress</a></li>
        
            <li><a href="#event:touchstart">touchstart</a></li>
        
            <li><a href="#event:touchmove">touchmove</a></li>
        
            <li><a href="#event:touchend">touchend</a></li>
        
            <li><a href="#event:fullscreenstart">fullscreenstart</a></li>
        
            <li><a href="#event:fullscreenend">fullscreenend</a></li>
        
            <li><a href="#event:cancelfullscreen">cancelfullscreen</a></li>
        
            <li><a href="#event:viewchange">viewchange</a></li>
        
            <li><a href="#event:zoomstart">zoomstart</a></li>
        
            <li><a href="#event:zooming">zooming</a></li>
        
            <li><a href="#event:zoomend">zoomend</a></li>
        
            <li><a href="#event:touchactstart">touchactstart</a></li>
        
            <li><a href="#event:touchacting">touchacting</a></li>
        
            <li><a href="#event:touchactend">touchactend</a></li>
        
        </ul>
    
</nav>


<section class="classmain">
    


<header>
    
        <h2>Map</h2>
        
            <div class="class-description">The central class of the library, to create a map on a container.</div>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    <!-- <h2>Constructor</h2> -->
    
    <h4 class="name" id="Map"><span class="type-signature"></span>new <a href="#Map">Map</a><span class="signature">(container, options)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L148" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L148" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#Map" class="improvelink">[link]</a> -->
    </h4>

    
    





    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var map = new maptalks.Map("map",{
     center:     [180,0],
     zoom:  4,
     baseLayer : new maptalks.TileLayer("base",{
         urlTemplate:'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
         subdomains:['a','b','c']
     }),
     layers : [
         new maptalks.VectorLayer('v', [new maptalks.Marker([180, 0])])
     ]
});</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>container</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">string</span>
|

<span class="param-type">HTMLElement</span>
|

<span class="param-type">object</span>


            
            </td>

            

            <td class="description last">The container to create the map on, can be:<br>
                                         1. A HTMLElement container.<br/>
                                         2. ID of a HTMLElement container.<br/>
                                         3. Any canvas compatible container</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">construct options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>center</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Number></span>
|

<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">initial center of the map.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">initial zoom of the map.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>spatialReference</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">map's spatial reference, default is using projection EPSG:3857 with resolutions used by google map/osm.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>baseLayer</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Layer.html">Layer</a></span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">base layer that will be set to map initially.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">layers that will be added to map initially.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>*</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">*</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">any other option defined in <a href="Map.html#options">Map.options</a>      [description]</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




    <h5>Extends:</h5>
    


    <ul>
        <li><a href="Class.html">Class</a></li>
    </ul>






    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html">Eventable</a>
            
            <a href="Handlerable.html">Handlerable</a>
            
            <a href="ui.Menuable.html">ui.Menuable</a>
            
            <a href="Renderable.html">Renderable</a>
            
        
    </li></ul>











<h5>Fires:</h5>
<ul>
    <li><a href="#event:spatialreferencechange">spatialreferencechange</a></li>

    <li><a href="#event:baselayerchangestart">baselayerchangestart</a></li>

    <li><a href="#event:baselayerchangeend">baselayerchangeend</a></li>

    <li><a href="#event:setbaselayer">setbaselayer</a></li>

    <li><a href="#event:baselayerload">baselayerload</a></li>

    <li><a href="#event:baselayerremove">baselayerremove</a></li>

    <li><a href="#event:addlayer">addlayer</a></li>

    <li><a href="#event:removelayer">removelayer</a></li>

    <li><a href="#event:resize">resize</a></li>

    <li><a href="#event:movestart">movestart</a></li>

    <li><a href="#event:moving">moving</a></li>

    <li><a href="#event:moveend">moveend</a></li>

    <li><a href="#event:dragrotatestart">dragrotatestart</a></li>

    <li><a href="#event:dragrotating">dragrotating</a></li>

    <li><a href="#event:dragrotateend">dragrotateend</a></li>

    <li><a href="#event:animating">animating</a></li>

    <li><a href="#event:animateinterrupted">animateinterrupted</a></li>

    <li><a href="#event:animateend">animateend</a></li>

    <li><a href="#event:animatestart">animatestart</a></li>

    <li><a href="#event:pitch">pitch</a></li>

    <li><a href="#event:pitchend">pitchend</a></li>

    <li><a href="#event:mousedown">mousedown</a></li>

    <li><a href="#event:mouseup">mouseup</a></li>

    <li><a href="#event:mouseover">mouseover</a></li>

    <li><a href="#event:mouseout">mouseout</a></li>

    <li><a href="#event:mouseenter">mouseenter</a></li>

    <li><a href="#event:mouseleave">mouseleave</a></li>

    <li><a href="#event:mousemove">mousemove</a></li>

    <li><a href="#event:click">click</a></li>

    <li><a href="#event:dblclick">dblclick</a></li>

    <li><a href="#event:contextmenu">contextmenu</a></li>

    <li><a href="#event:keypress">keypress</a></li>

    <li><a href="#event:touchstart">touchstart</a></li>

    <li><a href="#event:touchmove">touchmove</a></li>

    <li><a href="#event:touchend">touchend</a></li>

    <li><a href="#event:fullscreenstart">fullscreenstart</a></li>

    <li><a href="#event:fullscreenend">fullscreenend</a></li>

    <li><a href="#event:cancelfullscreen">cancelfullscreen</a></li>

    <li><a href="#event:viewchange">viewchange</a></li>

    <li><a href="#event:zoomstart">zoomstart</a></li>

    <li><a href="#event:zooming">zooming</a></li>

    <li><a href="#event:zoomend">zoomend</a></li>

    <li><a href="#event:touchactstart">touchactstart</a></li>

    <li><a href="#event:touchacting">touchacting</a></li>

    <li><a href="#event:touchactend">touchactend</a></li>
</ul>














<hr>
    
    </div>

    <!-- 
        <h3 class="subsection-title">Extends</h3>

        


    <ul>
        <li><a href="Class.html">Class</a></li>
    </ul>


     -->

    

    

     

    

    
        <h3 class="subsection-title">Members</h3>

        
            
<li>
<h4 class="name" id="options"><span class="type-signature">(constant) </span>options<span class="type-signature"></span>

<!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L81" class="improvelink">[help to improve]</a>
    
    <a href="#options" class="improvelink">[link]</a></h4> -->
</li>














    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>



            

            <td class="description last">map's options, options must be updated by config method:<br> map.config('zoomAnimation', false);
                <h6>Properties</h6>

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>centerCross</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">Display a red cross in the center of map</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>seamlessZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether to use seamless zooming mode</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomInCenter</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether to fix in the center when zooming</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomOrigin</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">zoom origin in container point, e.g. [400, 300]</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomAnimation</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">enable zooming animation</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomAnimationDuration</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    330
                
                </td>
            

            <td class="description last">zoom animation duration.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>panAnimation</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">continue to animate panning when draging or touching ended.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>panAnimationDuration</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    600
                
                </td>
            

            <td class="description last">duration of pan animation.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomable</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to enable map zooming.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>enableInfoWindow</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to enable infowindow on this map.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>hitDetect</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to enable hit detecting of layers for cursor style on this map, disable it to improve performance.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>hitDetectLimit</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    5
                
                </td>
            

            <td class="description last">the maximum number of layers to perform hit detect.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fpsOnInteracting</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    25
                
                </td>
            

            <td class="description last">fps when map is interacting, some slow layers will not be drawn on interacting when fps is low. Set to 0 to disable it.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layerCanvasLimitOnInteracting</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    -1
                
                </td>
            

            <td class="description last">limit of layer canvas to draw on map when interacting, set it to improve perf.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>maxZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the maximum zoom the map can be zooming to.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>minZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the minimum zoom the map can be zooming to.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>maxExtent</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>



            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">when maxExtent is set, map will be restricted to the give max extent and bouncing back when user trying to pan ouside the extent.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fixCenterOnResize</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether to fix map center when map is resized</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>maxPitch</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    80
                
                </td>
            

            <td class="description last">max pitch</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>maxVisualPitch</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    70
                
                </td>
            

            <td class="description last">the max pitch to be visual</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewHistory</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to record view history</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewHistoryCount</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>



            
                <td class="default">
                
                    10
                
                </td>
            

            <td class="description last">the count of view history record.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>draggable</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">disable the map dragging if set to false.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dragPan</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">if true, map can be dragged to pan.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dragRotate</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">default true. If true, map can be dragged to rotate by right click or ctrl + left click.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dragPitch</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">default true. If true, map can be dragged to pitch by right click or ctrl + left click.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dragRotatePitch</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">if true, map is dragged to pitch and rotate at the same time.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>touchGesture</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to zoom/rotate/tilt by two finger touch gestures.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>touchZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to zoom by touch pinch.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>touchRotate</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to rotate by touch pinch.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>touchPitch</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to pitch by touch pinch.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>touchZoomRotate</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">if true, map is to zoom and rotate at the same time by touch pinch.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>doubleClickZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to zoom by double click events.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>scrollWheelZoom</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to allow map to zoom by scroll wheel events.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>geometryEvents</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">enable/disable firing geometry events</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>control</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether allow map to add controls.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>attribution</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to display the attribution control on the map. if true, attribution display maptalks info; if object, you can specify positon or your base content, and both;</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomControl</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">display the zoom control on the map if set to true or a object as the control construct option.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>scaleControl</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">display the scale control on the map if set to true or a object as the control construct option.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>overviewControl</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>



            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">display the overview control on the map if set to true or a object as the control construct option.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fog</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>



            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether to draw fog in far distance.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fogColor</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Number></span>


            
            </td>



            
                <td class="default">
                
                    [233, 233, 233]
                
                </td>
            

            <td class="description last">color of fog: [r, g, b]</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>renderer</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            
                <td class="default">
                
                    canvas
                
                </td>
            

            <td class="description last">renderer type. Don't change it if you are not sure about it. About renderer, see TODO.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>devicePixelRatio</code>
                    
                        
                           <span class="signature-attributes">opt</span>
                        
                        

                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">device pixel ratio to override device's default one</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L81">line 81</a>
        

    </li></ul></dd>
    

    

    

    
</dl>






<hr>
        
            
<li>
<h4 class="name" id="VERSION"><span class="type-signature">(constant) </span>VERSION<span class="type-signature"></span>

<!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L188" class="improvelink">[help to improve]</a>
    
    <a href="#VERSION" class="improvelink">[link]</a></h4> -->
</li>














    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">Version of library</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L188">line 188</a>
        

    </li></ul></dd>
    

    

    

    
</dl>






<hr>
        
            
<li>
<h4 class="name" id="JSON_VERSION"><span class="type-signature">(constant) </span>JSON_VERSION<span class="type-signature"></span>

<!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L99" class="improvelink">[help to improve]</a>
    
    <a href="#JSON_VERSION" class="improvelink">[link]</a></h4> -->
</li>














    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">Version of the <a href="Map.html#toJSON">JSON</a> schema.</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js">map/Map.Profile.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L99">line 99</a>
        

    </li></ul></dd>
    

    

    

    
</dl>






<hr>
        
    

    
        
                    <h3 class="subsection-title">Static Methods</h3>
                
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id=".addOnLoadHook"><span class="type-signature">(protected, static) </span><a href="#.addOnLoadHook">addOnLoadHook</a><span class="signature">(fn)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L232" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L232" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#.addOnLoadHook" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Add hooks for additional codes when map's loading complete, useful for plugin developping.
Note that it can only be called before the map is created.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>fn</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id=".fromJSON"><span class="type-signature">(static) </span><a href="#.fromJSON">fromJSON</a><span class="signature">(container, mapJSON, options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L186" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L186" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#.fromJSON" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Reproduce a map from map's profile JSON.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var map = Map.fromJSON('map', mapProfile);</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>container</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">string</span>
|

<span class="param-type">HTMLElement</span>
|

<span class="param-type">object</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">The container to create the map on, can be:<br>                                         1. A HTMLElement container.<br/>                                         2. ID of a HTMLElement container.<br/>                                         3. A canvas compatible container in node,                                         e.g. <a href="https://github.com/Automattic/node-canvas">node-canvas</a>,                                             <a href="https://github.com/gliffy/canvas2svg">canvas2svg</a></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>mapJSON</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">map's profile JSON</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>baseLayer</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether to import the baseLayer</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether to import the layers</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        


    


<hr>
        

        
                    <h3 class="subsection-title">Methods</h3>
                
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isLoaded"><span class="type-signature"></span><a href="#isLoaded">isLoaded</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L247" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L247" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isLoaded" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether the map is loaded or not.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getContainer"><span class="type-signature"></span><a href="#getContainer">getContainer</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L255" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L255" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getContainer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's container
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">HTMLElement</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getSpatialReference"><span class="type-signature"></span><a href="#getSpatialReference">getSpatialReference</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L263" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L263" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getSpatialReference" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the spatial reference of the Map.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">SpatialReference</span>:

        
<!-- <div class="param-desc"> -->
    map's spatial reference
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setSpatialReference"><span class="type-signature"></span><a href="#setSpatialReference">setSpatialReference</a><span class="signature">(spatialReference)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L301" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L301" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setSpatialReference" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Change the spatial reference of the map. <br>
A SpatialReference is a series of settings to decide the map presentation:<br>
1. the projection.<br>
2. zoom levels and resolutions. <br>
3. full extent.<br>
There are some <a href="http://www.foo.com">predefined spatial references</a>, and surely you can <a href="http://www.foo.com">define a custom one.</a>.<br>
SpatialReference can also be updated by map.config('spatialReference', spatialReference);
</div>


    <!--<h5>Examples:</h5>-->
    
    
        <pre class="prettyprint"><code>map.setSpatialReference({
            projection:'EPSG:4326',
            resolutions: (function() {
                const resolutions = [];
                for (let i=0; i &lt; 19; i++) {
                    resolutions[i] = 180/(Math.pow(2, i)*128);
                }
                return resolutions;
            })()
 });
       </code></pre>
    

    
        <pre class="prettyprint"><code>map.config('spatialReference', {
            projection:'EPSG:4326',
            resolutions: (function() {
                const resolutions = [];
                for (let i=0; i &lt; 19; i++) {
                    resolutions[i] = 180/(Math.pow(2, i)*128);
                }
                return resolutions;
            })()
        });</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>spatialReference</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">SpatialReference</span>


            
            </td>

            

            <td class="description last">spatial reference</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:spatialreferencechange">spatialreferencechange</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getProjection"><span class="type-signature"></span><a href="#getProjection">getProjection</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L379" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L379" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getProjection" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the projection of the map. <br>
Projection is an algorithm for map projection, e.g. well-known <a href="https://en.wikipedia.org/wiki/Mercator_projection">Mercator Projection</a> <br>
A projection must have 2 methods: <br>
1. project(coordinate) - project the input coordinate <br>
2. unproject(coordinate) - unproject the input coordinate <br>
Projection also contains measuring method usually extended from a measurer: <br>
1. measureLength(coord1, coord2) - compute length between 2 coordinates.  <br>
2. measureArea(coords[]) - compute area of the input coordinates. <br>
3. locate(coord, distx, disty) - compute the coordinate from the coord with xdist on axis x and ydist on axis y.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getFullExtent"><span class="type-signature"></span><a href="#getFullExtent">getFullExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L391" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L391" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getFullExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's full extent, which is defined in map's spatial reference. <br>
eg: {'left': -180, 'right' : 180, 'top' : 90, 'bottom' : -90}
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setCursor"><span class="type-signature"></span><a href="#setCursor">setCursor</a><span class="signature">(cursor)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L405" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L405" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setCursor" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set map's cursor style, cursor style is same with CSS.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.setCursor('url(cursor.png) 4 12, auto');</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>cursor</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            <td class="description last">cursor style</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="resetCursor"><span class="type-signature"></span><a href="#resetCursor">resetCursor</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L418" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L418" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#resetCursor" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Reset map's cursor style.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.resetCursor();</code></pre>
    




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getCenter"><span class="type-signature"></span><a href="#getCenter">getCenter</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L426" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L426" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getCenter" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get center of the map.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setCenter"><span class="type-signature"></span><a href="#setCenter">setCenter</a><span class="signature">(center)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L439" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L439" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setCenter" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set a new center to the map.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>center</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getSize"><span class="type-signature"></span><a href="#getSize">getSize</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L463" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L463" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getSize" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's size (width and height) in pixel.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Size.html">Size</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getContainerExtent"><span class="type-signature"></span><a href="#getContainerExtent">getContainerExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L474" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L474" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getContainerExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get container extent of the map
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="PointExtent.html">PointExtent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getExtent"><span class="type-signature"></span><a href="#getExtent">getExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L508" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L508" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the geographical extent of map's current view extent.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getProjExtent"><span class="type-signature"></span><a href="#getProjExtent">getProjExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L517" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L517" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getProjExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the projected geographical extent of map's current view extent.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getPrjExtent"><span class="type-signature"></span><a href="#getPrjExtent">getPrjExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L530" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L530" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getPrjExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Alias for getProjExtent
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMaxExtent"><span class="type-signature"></span><a href="#getMaxExtent">getMaxExtent</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L538" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L538" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMaxExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the max extent that the map is restricted to.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setMaxExtent"><span class="type-signature"></span><a href="#setMaxExtent">setMaxExtent</a><span class="signature">(extent)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L552" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L552" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setMaxExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets the max extent that the map is restricted to.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.setMaxExtent(map.getExtent());</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>extent</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getZoom"><span class="type-signature"></span><a href="#getZoom">getZoom</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L572" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L572" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's current zoom.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getZoomForScale"><span class="type-signature"></span><a href="#getZoomForScale">getZoomForScale</a><span class="signature">(scale, fromZoom, isFraction)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L583" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L583" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getZoomForScale" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate the target zoom if scaling from "fromZoom" by "scale"
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>scale</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fromZoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>isFraction</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            

            <td class="description last">can return fractional zoom</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    zoom fit for scale starting from fromZoom
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setZoom"><span class="type-signature"></span><a href="#setZoom">setZoom</a><span class="signature">(zoom, options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L640" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L640" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets zoom of the map
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>animation</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    true
                
                </td>
            

            <td class="description last">whether zoom is animation, true by default</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMaxZoom"><span class="type-signature"></span><a href="#getMaxZoom">getMaxZoom</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L657" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L657" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMaxZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the max zoom that the map can be zoom to.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setMaxZoom"><span class="type-signature"></span><a href="#setMaxZoom">setMaxZoom</a><span class="signature">(maxZoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L669" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L669" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setMaxZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets the max zoom that the map can be zoom to.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>maxZoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMinZoom"><span class="type-signature"></span><a href="#getMinZoom">getMinZoom</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L686" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L686" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMinZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the min zoom that the map can be zoom to.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setMinZoom"><span class="type-signature"></span><a href="#setMinZoom">setMinZoom</a><span class="signature">(minZoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L698" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L698" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setMinZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets the min zoom that the map can be zoom to.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>minZoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMaxNativeZoom"><span class="type-signature"></span><a href="#getMaxNativeZoom">getMaxNativeZoom</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L717" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L717" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMaxNativeZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Maximum zoom the map has
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getGLZoom"><span class="type-signature"></span><a href="#getGLZoom">getGLZoom</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L729" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L729" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getGLZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Zoom for world point in WebGL context
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getGLScale"><span class="type-signature"></span><a href="#getGLScale">getGLScale</a><span class="signature">(zoom<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L742" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L742" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getGLScale" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate scale from gl zoom to given zoom (default by current zoom)
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">target zoom, current zoom by default</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="zoomIn"><span class="type-signature"></span><a href="#zoomIn">zoomIn</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L753" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L753" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#zoomIn" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    zoom in
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="zoomOut"><span class="type-signature"></span><a href="#zoomOut">zoomOut</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L761" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L761" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#zoomOut" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    zoom out
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isZooming"><span class="type-signature"></span><a href="#isZooming">isZooming</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L769" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L769" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isZooming" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether the map is zooming
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isInteracting"><span class="type-signature"></span><a href="#isInteracting">isInteracting</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L777" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L777" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isInteracting" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether the map is being interacted
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setCenterAndZoom"><span class="type-signature"></span><a href="#setCenterAndZoom">setCenterAndZoom</a><span class="signature">(center, zoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L787" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L787" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setCenterAndZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets the center and zoom at the same time.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>center</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getFitZoom"><span class="type-signature"></span><a href="#getFitZoom">getFitZoom</a><span class="signature">(extent, isFraction)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L804" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L804" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getFitZoom" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate the zoom level that contains the given extent with the maximum zoom level possible.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>extent</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>isFraction</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            

            <td class="description last">can return fractional zoom</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    zoom fit for scale starting from fromZoom
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getView"><span class="type-signature"></span><a href="#getView">getView</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L828" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L828" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's current view (center/zoom/pitch/bearing)
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        
<!-- <div class="param-desc"> -->
    { center : *, zoom : *, pitch : *, bearing : * }
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setView"><span class="type-signature"></span><a href="#setView">setView</a><span class="signature">(view)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L842" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L842" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set map's center/zoom/pitch/bearing at one time
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>view</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">a object containing center/zoom/pitch/bearing
return {Map} this</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getResolution"><span class="type-signature"></span><a href="#getResolution">getResolution</a><span class="signature">(zoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L866" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L866" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getResolution" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's resolution
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">zoom or current zoom if not given</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    resolution
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getScale"><span class="type-signature"></span><a href="#getScale">getScale</a><span class="signature">(zoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L875" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L875" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getScale" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get scale of resolutions from zoom to max zoom
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">zoom or current zoom if not given</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    scale
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="fitExtent"><span class="type-signature"></span><a href="#fitExtent">fitExtent</a><span class="signature">(extent, zoomOffset)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L888" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L888" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#fitExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set the map to be fit for the given extent with the max zoom level possible.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>extent</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>

            

            <td class="description last">extent</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoomOffset</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">zoom offset</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    - this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getBaseLayer"><span class="type-signature"></span><a href="#getBaseLayer">getBaseLayer</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L911" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L911" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getBaseLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the base layer of the map.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Layer.html">Layer</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setBaseLayer"><span class="type-signature"></span><a href="#setBaseLayer">setBaseLayer</a><span class="signature">(baseLayer)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L924" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L924" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setBaseLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sets a new base layer to the map.<br>
Some events will be thrown such as baselayerchangestart, baselayerload, baselayerchangeend.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>baseLayer</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Layer.html">Layer</a></span>


            
            </td>

            

            <td class="description last">new base layer</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:setbaselayer">setbaselayer</a></li>

    <li><a href="#event:baselayerchangestart">baselayerchangestart</a></li>

    <li><a href="#event:baselayerchangeend">baselayerchangeend</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="removeBaseLayer"><span class="type-signature"></span><a href="#removeBaseLayer">removeBaseLayer</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L993" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L993" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#removeBaseLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Remove the base layer from the map
</div>




<!--  -->





<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:baselayerremove">baselayerremove</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getLayers"><span class="type-signature"></span><a href="#getLayers">getLayers</a><span class="signature">(filter<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1020" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1020" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getLayers" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the layers of the map, except base layer (which should be by getBaseLayer). <br>
A filter function can be given to filter layers, e.g. exclude all the VectorLayers.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var vectorLayers = map.getLayers(function (layer) {
    return (layer instanceof VectorLayer);
});</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>filter</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            <td class="description last">a filter function of layers, return false to exclude the given layer.</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Array.&lt;<a href="Layer.html">Layer</a>></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getLayer"><span class="type-signature"></span><a href="#getLayer">getLayer</a><span class="signature">(id)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1037" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1037" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the layer with the given id.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>id</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            <td class="description last">layer id</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Layer.html">Layer</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="addLayer"><span class="type-signature"></span><a href="#addLayer">addLayer</a><span class="signature">(layer)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1058" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1058" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#addLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Add a new layer on the top of the map.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>layer</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Layer.html">Layer</a></span>
|

<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>

            

            <td class="description last">one or more layers to add</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:addlayer">addlayer</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="removeLayer"><span class="type-signature"></span><a href="#removeLayer">removeLayer</a><span class="signature">(layer)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1113" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1113" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#removeLayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Remove a layer from the map
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>layer</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>
|

<span class="param-type">Array.&lt;String></span>
|

<span class="param-type"><a href="Layer.html">Layer</a></span>
|

<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>

            

            <td class="description last">one or more layers or layer ids</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:removelayer">removelayer</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="sortLayers"><span class="type-signature"></span><a href="#sortLayers">sortLayers</a><span class="signature">(layers)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1178" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1178" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#sortLayers" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Sort layers according to the order provided, the last will be on the top.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.addLayer([layer1, layer2, layer3]);
map.sortLayers([layer2, layer3, layer1]);
map.sortLayers(['3', '2', '1']); // sort by layer ids.</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>layers</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;string></span>
|

<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>

            

            <td class="description last">layers or layer ids to sort</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="toDataURL"><span class="type-signature"></span><a href="#toDataURL">toDataURL</a><span class="signature">(options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1212" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1212" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#toDataURL" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Exports image from the map's canvas.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>mimeType</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                    image/png
                
                </td>
            

            <td class="description last">mime type of the image</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>save</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether pop a file save dialog to save the export image.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>fileName</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                    export
                
                </td>
            

            <td class="description last">specify the file name, if options.save is true.</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">String</span>:

        
<!-- <div class="param-desc"> -->
    image of base64 format.
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordToPoint"><span class="type-signature"></span><a href="#coordToPoint">coordToPoint</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1252" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1252" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordToPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for coordinateToPoint
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="pointToCoord"><span class="type-signature"></span><a href="#pointToCoord">pointToCoord</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1259" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1259" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#pointToCoord" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for pointToCoordinate
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordToViewPoint"><span class="type-signature"></span><a href="#coordToViewPoint">coordToViewPoint</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1266" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1266" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordToViewPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for coordinateToViewPoint
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="viewPointToCoord"><span class="type-signature"></span><a href="#viewPointToCoord">viewPointToCoord</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1273" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1273" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#viewPointToCoord" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for viewPointToCoordinate
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordToContainerPoint"><span class="type-signature"></span><a href="#coordToContainerPoint">coordToContainerPoint</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1280" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1280" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordToContainerPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for coordinateToContainerPoint
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="containerPointToCoord"><span class="type-signature"></span><a href="#containerPointToCoord">containerPointToCoord</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1288" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1288" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#containerPointToCoord" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    shorter alias for containerPointToCoordinate
</div>




<!--  -->





<!-- event properties -->






























<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="containerPointToViewPoint"><span class="type-signature"></span><a href="#containerPointToViewPoint">containerPointToViewPoint</a><span class="signature">(containerPoint, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1299" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1299" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#containerPointToViewPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a container point to the view point.
Usually used in plugin development.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">optional point to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="viewPointToContainerPoint"><span class="type-signature"></span><a href="#viewPointToContainerPoint">viewPointToContainerPoint</a><span class="signature">(viewPoint, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1315" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1315" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#viewPointToContainerPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a view point to the container point.
Usually used in plugin development.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">optional point to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="checkSize"><span class="type-signature"></span><a href="#checkSize">checkSize</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1329" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1329" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#checkSize" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Checks if the map container size changed and updates the map if so.
</div>




<!--  -->





<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:resize">resize</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="locate"><span class="type-signature"></span><a href="#locate">locate</a><span class="signature">(coordinate, dx, dy)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1376" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1376" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#locate" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Computes the coordinate from the given meter distance.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">source coordinate</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dx</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">meter distance on X axis</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dy</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">meter distance on Y axis</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        
<!-- <div class="param-desc"> -->
    Result coordinate
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMainPanel"><span class="type-signature"></span><a href="#getMainPanel">getMainPanel</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1385" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1385" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMainPanel" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Return map's main panel
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">HTMLElement</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getPanels"><span class="type-signature"></span><a href="#getPanels">getPanels</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1393" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1393" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getPanels" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Returns map panels.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="remove"><span class="type-signature"></span><a href="#remove">remove</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1401" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1401" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#remove" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Remove the map
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isRemoved"><span class="type-signature"></span><a href="#isRemoved">isRemoved</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1431" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1431" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isRemoved" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    whether the map is removed
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isMoving"><span class="type-signature"></span><a href="#isMoving">isMoving</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1439" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1439" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isMoving" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether the map is moving
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getDevicePixelRatio"><span class="type-signature"></span><a href="#getDevicePixelRatio">getDevicePixelRatio</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1564" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1564" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getDevicePixelRatio" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get device's devicePixelRatio, you can override it by setting devicePixelRatio in options.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="offsetPlatform"><span class="type-signature"></span><a href="#offsetPlatform">offsetPlatform</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1883" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1883" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#offsetPlatform" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Gets map panel's current view point.
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getViewPoint"><span class="type-signature"></span><a href="#getViewPoint">getViewPoint</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1898" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1898" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getViewPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's view point, adding in frame offset
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        
<!-- <div class="param-desc"> -->
    map view point
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordinateToPoint"><span class="type-signature"></span><a href="#coordinateToPoint">coordinateToPoint</a><span class="signature">(coordinate, zoom<span class="signature-attributes">opt</span>, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2037" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2037" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordinateToPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a coordinate to the 2D point in current zoom or in the specific zoom. <br>
The 2D point's coordinate system's origin is the same with map's origin.
Usually used in plugin development.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var point = map.coordinateToPoint(new Coordinate(121.3, 29.1));</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">coordinate</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">zoom level</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">optional point to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        
<!-- <div class="param-desc"> -->
    2D point
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="pointToCoordinate"><span class="type-signature"></span><a href="#pointToCoordinate">pointToCoordinate</a><span class="signature">(point, zoom, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2056" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2056" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#pointToCoordinate" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a 2D point in current zoom or a specific zoom to a coordinate.
Usually used in plugin development.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var coord = map.pointToCoordinate(new Point(4E6, 3E4));</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>point</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">2D point</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">point's zoom level</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">optional coordinate to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        
<!-- <div class="param-desc"> -->
    coordinate
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordinateToViewPoint"><span class="type-signature"></span><a href="#coordinateToViewPoint">coordinateToViewPoint</a><span class="signature">(coordinate, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2074" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2074" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordinateToViewPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a geographical coordinate to view point.<br>
A view point is a point relative to map's mapPlatform panel's position. <br>
Usually used in plugin development.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">optional point to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="viewPointToCoordinate"><span class="type-signature"></span><a href="#viewPointToCoordinate">viewPointToCoordinate</a><span class="signature">(viewPoint, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2089" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2089" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#viewPointToCoordinate" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a view point to the geographical coordinate.
Usually used in plugin development.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">optional coordinate to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="coordinateToContainerPoint"><span class="type-signature"></span><a href="#coordinateToContainerPoint">coordinateToContainerPoint</a><span class="signature">(zoom<span class="signature-attributes">opt</span>, out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2105" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2105" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#coordinateToContainerPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Convert a geographical coordinate to the container point. <br>
 A container point is a point relative to map container's top-left corner. <br>
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code></code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">coordinate</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">zoom level</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last">optional point to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="containerPointToCoordinate"><span class="type-signature"></span><a href="#containerPointToCoordinate">containerPointToCoordinate</a><span class="signature">(out<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2120" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2120" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#containerPointToCoordinate" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a container point to geographical coordinate.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code></code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>out</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">optional coordinate to receive result</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="containerToExtent"><span class="type-signature"></span><a href="#containerToExtent">containerToExtent</a><span class="signature">(containerExtent)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2134" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2134" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#containerToExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a container point extent to the geographic extent.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>containerExtent</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="PointExtent.html">PointExtent</a></span>


            
            </td>

            

            <td class="description last">containeproints extent</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        
<!-- <div class="param-desc"> -->
    geographic extent
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="distanceToPixel"><span class="type-signature"></span><a href="#distanceToPixel">distanceToPixel</a><span class="signature">(xDist, yDist)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2155" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2155" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#distanceToPixel" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts geographical distances to the pixel length.<br>
The value varis with difference zoom level.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>xDist</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on X axis.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>yDist</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on Y axis.</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Size.html">Size</a></span>:

        
<!-- <div class="param-desc"> -->
    result.width: pixel length on X axis; result.height: pixel length on Y axis
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="distanceToPoint"><span class="type-signature"></span><a href="#distanceToPoint">distanceToPoint</a><span class="signature">(xDist, yDist, zoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2183" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2183" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#distanceToPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts geographical distances to the 2d point length.<br>
The value varis with difference zoom level.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>xDist</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on X axis.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>yDist</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on Y axis.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">point's zoom</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Point.html">Point</a></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="pixelToDistance"><span class="type-signature"></span><a href="#pixelToDistance">pixelToDistance</a><span class="signature">(width, height)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2208" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2208" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#pixelToDistance" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts pixel size to geographical distance.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>width</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">pixel width</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>height</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">pixel height</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    distance - Geographical distance
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="pointToDistance"><span class="type-signature"></span><a href="#pointToDistance">pointToDistance</a><span class="signature">(dx, dy, zoom)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2233" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2233" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#pointToDistance" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts 2d point distances to geographic length.<br>
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>dx</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on X axis.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>dy</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">distance on Y axis.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>zoom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">point's zoom</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    distance
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="locateByPoint"><span class="type-signature"></span><a href="#locateByPoint">locateByPoint</a><span class="signature">(coordinate, px, py)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2257" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2257" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#locateByPoint" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Computes the coordinate from the given pixel distance.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">source coordinate</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>px</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">pixel distance on X axis</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>py</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">pixel distance on Y axis</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Coordinate.html">Coordinate</a></span>:

        
<!-- <div class="param-desc"> -->
    Result coordinate
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="_pointToExtent"><span class="type-signature">(protected) </span><a href="#_pointToExtent">_pointToExtent</a><span class="signature">(extent2D)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2300" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L2300" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#_pointToExtent" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Converts a view point extent to the geographic extent.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>extent2D</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="PointExtent.html">PointExtent</a></span>


            
            </td>

            

            <td class="description last">view points extent</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Extent.html">Extent</a></span>:

        
<!-- <div class="param-desc"> -->
    geographic extent
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="animateTo"><span class="type-signature"></span><a href="#animateTo">animateTo</a><span class="signature">(view, options<span class="signature-attributes">opt</span>, step<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L47" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L47" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#animateTo" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Update map's view with animation.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.animateTo({    zoom : 13,    center : [0, 0],    pitch : 30,    bearing : 60}, {    duration : 6000,    easing : 'out'}, function(frame) {    if (frame.state.playState === 'finished') {        console.log('animation finished');    }});</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>view</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">view object</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>easing</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                    out
                
                </td>
            

            <td class="description last"></td>
        </tr>

    

        <tr>
            
                <td class="name"><code>duration</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="default">
                
                    map.options.zoomAnimationDuration
                
                </td>
            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    

        <tr>
            
                <td class="name"><code>step</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">step function during animation, animation frame as the parameter</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isAnimating"><span class="type-signature"></span><a href="#isAnimating">isAnimating</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L181" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L181" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isAnimating" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether the map is animating with .animateTo
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getFov"><span class="type-signature"></span><a href="#getFov">getFov</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L27" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L27" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getFov" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's fov (field of view);
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    fov in degree
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setFov"><span class="type-signature"></span><a href="#setFov">setFov</a><span class="signature">(fov)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L39" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L39" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setFov" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set a new fov to map
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>fov</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">new fov in degree</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getBearing"><span class="type-signature"></span><a href="#getBearing">getBearing</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L66" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L66" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getBearing" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's bearing
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    bearing in degree
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setBearing"><span class="type-signature"></span><a href="#setBearing">setBearing</a><span class="signature">(bearing)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L78" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L78" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setBearing" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set a new bearing to map
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>bearing</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">new bearing in degree</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getPitch"><span class="type-signature"></span><a href="#getPitch">getPitch</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L126" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L126" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getPitch" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map's pitch
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    pitch in degree
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setPitch"><span class="type-signature"></span><a href="#setPitch">setPitch</a><span class="signature">(pitch)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L138" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L138" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setPitch" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set a new pitch to map
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>pitch</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            

            <td class="description last">new pitch in degree</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="isFullScreen"><span class="type-signature"></span><a href="#isFullScreen">isFullScreen</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L7" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L7" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#isFullScreen" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    







<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        
<!-- <div class="param-desc"> -->
    Element is currently in fullscreen.
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="requestFullScreen"><span class="type-signature"></span><a href="#requestFullScreen">requestFullScreen</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L21" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L21" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#requestFullScreen" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Request for the full screen
</div>




<!--  -->





<!-- event properties -->


    

<table class="params">
    <thead>
    <tr>
        
        <th>Property</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>dom</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">containerDOM to requestFullScreen</td>
        </tr>

    
    </tbody>
</table>













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>dom</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>



            

            <td class="description last">containerDOM to requestFullScreen</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js">map/Map.FullScreen.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L21">line 21</a>
        

    </li></ul></dd>
    

    

    

    
</dl>









<h5>Fires:</h5>
<ul>
    <li><a href="#event:fullscreenstart">fullscreenstart</a></li>

    <li><a href="#event:fullscreenend">fullscreenend</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="cancelFullScreen"><span class="type-signature"></span><a href="#cancelFullScreen">cancelFullScreen</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L47" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L47" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#cancelFullScreen" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Cancel full screen
</div>




<!--  -->





<!-- event properties -->




















<h5>Fires:</h5>
<ul>
    <li><a href="#event:cancelfullscreen">cancelfullscreen</a></li>
</ul>









<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="panTo"><span class="type-signature"></span><a href="#panTo">panTo</a><span class="signature">(coordinate, options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Pan.js#L16" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Pan.js#L16" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#panTo" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Pan to the given coordinate
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">coordinate to pan to</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">pan options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>animation</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether pan with animation</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>duration</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    600
                
                </td>
            

            <td class="description last">pan animation duration</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="panBy"><span class="type-signature"></span><a href="#panBy">panBy</a><span class="signature">(point, options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Pan.js#L53" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Pan.js#L53" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#panBy" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Pan the map by the give point
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>point</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">distance to pan, in pixel</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">pan options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>animation</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether pan with animation</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>duration</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    600
                
                </td>
            

            <td class="description last">pan animation duration</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="toJSON"><span class="type-signature"></span><a href="#toJSON">toJSON</a><span class="signature">(options<span class="signature-attributes">opt</span>)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L111" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Profile.js#L111" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#toJSON" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Export the map's json, a snapshot of the map in JSON format.<br>It can be used to reproduce the instance by fromJSON method
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">export options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>baseLayer</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether to export base layer's JSON, if yes, it will be used as layer's toJSON options.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>clipExtent</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type"><a href="Extent.html">Extent</a></span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">if set with an extent instance, only the geometries intersectes with the extent will be exported.                                                            If set to true, map's current extent will be used.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>
|

<span class="param-type">Object</span>
|

<span class="param-type">Array.&lt;Object></span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">whether to export other layers' JSON, if yes, it will be used as layer's toJSON options.                                                       It can also be an array of layer export options with a "id" attribute to filter the layers to export.</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        
<!-- <div class="param-desc"> -->
    layer's JSON
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="computeLength"><span class="type-signature"></span><a href="#computeLength">computeLength</a><span class="signature">(coord1, coord2)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L18" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L18" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#computeLength" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate distance of two coordinates.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>var distance = map.computeLength([0, 0], [0, 20]);</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coord1</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Number></span>
|

<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">coordinate 1</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coord2</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Number></span>
|

<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            

            <td class="description last">coordinate 2</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    distance, unit is meter
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="computeGeometryLength"><span class="type-signature"></span><a href="#computeGeometryLength">computeGeometryLength</a><span class="signature">(geometry)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L35" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L35" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#computeGeometryLength" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate a geometry's length.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>geometry</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Geometry.html">Geometry</a></span>


            
            </td>

            

            <td class="description last">geometry to caculate</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    length, unit is meter
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="computeGeometryArea"><span class="type-signature"></span><a href="#computeGeometryArea">computeGeometryArea</a><span class="signature">(geometry)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L44" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L44" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#computeGeometryArea" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Caculate a geometry's area.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>geometry</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Geometry.html">Geometry</a></span>


            
            </td>

            

            <td class="description last">geometry to caculate</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        
<!-- <div class="param-desc"> -->
    area, unit is sq.meter
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="identify"><span class="type-signature"></span><a href="#identify">identify</a><span class="signature">(opts, callback)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L69" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Topo.js#L69" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#identify" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Identify the geometries on the given coordinate.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>map.identify({     coordinate: [0, 0],     layers: [layer] }, geos => {     console.log(geos); });</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>opts</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">the identify options
                <h6>Properties</h6>
                

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">coordinate to identify</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">the layers to perform identify on.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>filter</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">filter function of the result geometries, return false to exclude.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>count</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">limit of the result count.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>tolerance</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>

            
                <td class="default">
                
                    0
                
                </td>
            

            <td class="description last">identify tolerance in pixel.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>includeInternals</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether to identify internal layers.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>includeInvisible</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Boolean</span>


            
            </td>

            
                <td class="default">
                
                    false
                
                </td>
            

            <td class="description last">whether to identify invisible layers.</td>
        </tr>

    
    </tbody>
</table>

            </td>
        </tr>

    

        <tr>
            
                <td class="name"><code>callback</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            <td class="description last">the callback function using the result geometries as the parameter.</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="zoomToPreviousView"><span class="type-signature"></span><a href="#zoomToPreviousView">zoomToPreviousView</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L46" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L46" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#zoomToPreviousView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Zoom to the previous map view in view history
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        
<!-- <div class="param-desc"> -->
    map view
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="hasPreviousView"><span class="type-signature"></span><a href="#hasPreviousView">hasPreviousView</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L59" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L59" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#hasPreviousView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether has more previous view
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="zoomToNextView"><span class="type-signature"></span><a href="#zoomToNextView">zoomToNextView</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L70" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L70" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#zoomToNextView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Zoom to the next view in view history
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Object</span>:

        
<!-- <div class="param-desc"> -->
    map view
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="hasNextView"><span class="type-signature"></span><a href="#hasNextView">hasNextView</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L83" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L83" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#hasNextView" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Whether has more next view
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Boolean</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getViewHistory"><span class="type-signature"></span><a href="#getViewHistory">getViewHistory</a><span class="signature">()</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L110" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L110" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getViewHistory" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get map view history
</div>




<!--  -->





<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature">Array.&lt;Object></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="addControl"><span class="type-signature"></span><a href="#addControl">addControl</a><span class="signature">(control)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/control/Control.js#L281" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/control/Control.js#L281" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#addControl" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Add a control on the map.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>control</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="control.Control.html">control.Control</a></span>


            
            </td>

            

            <td class="description last">contorl to add</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="removeControl"><span class="type-signature"></span><a href="#removeControl">removeControl</a><span class="signature">(control)</span>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/control/Control.js#L295" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/control/Control.js#L295" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#removeControl" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Remove a control from the map.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>control</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="control.Control.html">control.Control</a></span>


            
            </td>

            

            <td class="description last">control to remove</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->




























<h5>Returns:</h5>
<span class="type-signature"><a href="Map.html">Map</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="on"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#on">on</a><span class="signature">(eventsOn, handler, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L11" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L11" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#on" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Register a handler function to be called whenever this event is fired.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>foo.on('mousedown mousemove mouseup', onMouseEvent, foo);</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventsOn</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">event types to register, seperated by space if more than one.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>handler</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">handler function to be called</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.on">Eventable.on</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">Any</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="addEventListener"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#addEventListener">addEventListener</a><span class="signature">(eventTypes, handler, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L64" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L64" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#addEventListener" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Alias for <a href="Eventable.html#.on">on</a>
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventTypes</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">event types to register, seperated by space if more than one.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>handler</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">handler function to be called</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.addEventListener">Eventable.addEventListener</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="once"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#once">once</a><span class="signature">(eventTypes, handler, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L77" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L77" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#once" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Same as on, except the listener will only get fired once and then removed.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>foo.once('mousedown mousemove mouseup', onMouseEvent, foo);</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventTypes</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">event types to register, seperated by space if more than one.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>handler</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">listener handler</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.once">Eventable.once</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="off"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#off">off</a><span class="signature">(eventsOff, handler, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L105" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L105" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#off" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Unregister the event handler for the specified event types.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>foo.off('mousedown mousemove mouseup', onMouseEvent, foo);</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventsOff</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">event types to unregister, seperated by space if more than one.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>handler</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">listener handler</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.off">Eventable.off</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="removeEventListener"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#removeEventListener">removeEventListener</a><span class="signature">(eventTypes, handler, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L152" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L152" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#removeEventListener" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Alias for <a href="Eventable.html#.off">off</a>
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventTypes</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">event types to unregister, seperated by space if more than one.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>handler</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">listener handler</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.removeEventListener">Eventable.removeEventListener</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="listens"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#listens">listens</a><span class="signature">(eventType, hanlder<span class="signature-attributes">opt</span>, context<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L165" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L165" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#listens" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Returns listener's count registered for the event type.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventType</code>
                
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            
                <td class="default">
                
                </td>
            

            <td class="description last">an event type</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>hanlder</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">listener function</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>context</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">the context of the handler</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.listens">Eventable.listens</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">Number</span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="copyEventListeners"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#copyEventListeners">copyEventListeners</a><span class="signature">(target)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L206" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L206" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#copyEventListeners" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Copy all the event listener to the target object
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>target</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">target object to copy to.</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.copyEventListeners">Eventable.copyEventListeners</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="fire"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#fire">fire</a><span class="signature">(eventType, param)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L227" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Eventable.js#L227" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#fire" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Fire an event, causing all handlers for that event name to run.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>eventType</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            <td class="description last">an event type to fire</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>param</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">parameters for the listener function.</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Eventable.html#.fire">Eventable.fire</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature"></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setMenu"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#setMenu">setMenu</a><span class="signature">(options)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L10" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L10" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setMenu" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set a context menu
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>foo.setMenu({ 'width'  : 160, 'custom' : false, 'items' : [     //return false to prevent event propagation    {'item': 'Query', 'click': function() {alert('Query Clicked!'); return false;}},    '-',    {'item': 'Edit', 'click': function() {alert('Edit Clicked!')}},    {'item': 'About', 'click': function() {alert('About Clicked!')}}   ]});</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">menu options</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.setMenu">ui.Menuable.setMenu</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="openMenu"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#openMenu">openMenu</a><span class="signature">(coordinate<span class="signature-attributes">opt</span>)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L39" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L39" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#openMenu" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Open the context menu, default on the center of the geometry or map.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        
        <th>Default</th>
        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>coordinate</code>
                
                    
                        <span class="signature-attributes">opt</span>
                    
                    
                    
                
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>

            
                <td class="default">
                
                    null
                
                </td>
            

            <td class="description last">coordinate to open the context menu</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.openMenu">ui.Menuable.openMenu</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setMenuItems"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#setMenuItems">setMenuItems</a><span class="signature">(items)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L61" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L61" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setMenuItems" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Set menu items to the context menu
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>items</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;Object></span>


            
            </td>

            

            <td class="description last">menu items</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.setMenuItems">ui.Menuable.setMenuItems</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getMenuItems"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#getMenuItems">getMenuItems</a><span class="signature">()</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L79" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L79" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getMenuItems" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the context menu items
</div>




<!--  -->





<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.getMenuItems">ui.Menuable.getMenuItems</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">Array.&lt;Object></span>:

        


    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="closeMenu"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#closeMenu">closeMenu</a><span class="signature">()</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L93" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L93" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#closeMenu" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Close the contexnt menu
</div>




<!--  -->





<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.closeMenu">ui.Menuable.closeMenu</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="removeMenu"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#removeMenu">removeMenu</a><span class="signature">()</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L105" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/ui/Menuable.js#L105" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#removeMenu" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Remove the context menu
</div>




<!--  -->





<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="ui.Menuable.html#.removeMenu">ui.Menuable.removeMenu</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="registerRenderer"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#registerRenderer">registerRenderer</a><span class="signature">(name, clazz)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/renderer/Renderable.js#L8" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/renderer/Renderable.js#L8" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#registerRenderer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Register a renderer class with the given name.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>name</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            <td class="description last">renderer's register key</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>clazz</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            <td class="description last">renderer's class, a function (not necessarily a <a href="Class.html">Class</a>).</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Renderable.html#.registerRenderer">Renderable.registerRenderer</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">*</span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="getRendererClass"><span class="type-signature"></span><i><span class="type-signature"> (mixin)  </span><a href="#getRendererClass">getRendererClass</a><span class="signature">(name)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/renderer/Renderable.js#L25" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/renderer/Renderable.js#L25" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#getRendererClass" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Get the registered renderer class by the given name
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>name</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            <td class="description last">renderer's register key</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->







    <h5>Mixes From:</h5>
    <ul><li>
        
            <a href="Renderable.html#.getRendererClass">Renderable.getRendererClass</a>
            
        
    </li></ul>






















<h5>Returns:</h5>
<span class="type-signature">function</span>:

        
<!-- <div class="param-desc"> -->
    renderer's class
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="callInitHooks"><span class="type-signature"></span><i><span class="type-signature"> (inherited)  </span><a href="#callInitHooks">callInitHooks</a><span class="signature">()</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L53" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L53" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#callInitHooks" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Visit and call all the init hooks defined on Class and its parents.
</div>




<!--  -->





<!-- event properties -->









    <h5>Inherited From:</h5>    
    <ul><li>
        <a href="Class.html#callInitHooks">Class#callInitHooks</a>
    </li></ul>
    



















<h5>Returns:</h5>
<span class="type-signature"><a href="Class.html">Class</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="setOptions"><span class="type-signature"></span><i><span class="type-signature"> (inherited)  </span><a href="#setOptions">setOptions</a><span class="signature">(options)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L64" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L64" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#setOptions" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    Merges options with the default options of the object.
</div>




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>options</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">options to set</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->









    <h5>Inherited From:</h5>    
    <ul><li>
        <a href="Class.html#setOptions">Class#setOptions</a>
    </li></ul>
    



















<h5>Returns:</h5>
<span class="type-signature"><a href="Class.html">Class</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="config"><span class="type-signature"></span><i><span class="type-signature"> (inherited)  </span><a href="#config">config</a><span class="signature">(conf)</span></i>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L94" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/core/Class.js#L94" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#config" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    1. Return object's options if no parameter is provided. <br/>2. update an option and enable/disable the handler if a handler with the same name existed.
</div>


    <!--<h5>Example:</h5>-->
    
    
        <pre class="prettyprint"><code>// Get marker's options;var options = marker.config();// Set map's option "draggable" to false and disable map's draggable handler.map.config('draggable', false);// You can update more than one options like this:map.config({    'scrollWheelZoom' : false,    'doubleClickZoom' : false});</code></pre>
    




<!--  -->




    

<table class="params">
    <thead>
    <tr>
        
        <th>Parameter</th>
        
        <th>Type</th>

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>conf</code>
                
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>

            

            <td class="description last">config to update</td>
        </tr>

    
    </tbody>
</table>



<!-- event properties -->









    <h5>Inherited From:</h5>    
    <ul><li>
        <a href="Class.html#config">Class#config</a>
    </li></ul>
    



















<h5>Returns:</h5>
<span class="type-signature"><a href="Class.html">Class</a></span>:

        
<!-- <div class="param-desc"> -->
    this
<!-- </div> -->



    


<hr>
        
    

    

    
        <h3 class="subsection-title">Events</h3>

        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:spatialreferencechange"><a href="#event:spatialreferencechange">spatialreferencechange</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L321" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L321" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:spatialreferencechange" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    spatialreferencechange event, fired when map's spatial reference is updated.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">spatialreferencechange</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>old</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the old spatial reference</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>new</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the new spatial reference changed to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L321">line 321</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:baselayerchangestart"><a href="#event:baselayerchangestart">baselayerchangestart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L928" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L928" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:baselayerchangestart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    baselayerchangestart event, fired when base layer is changed.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">baselayerchangestart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L928">line 928</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:baselayerchangeend"><a href="#event:baselayerchangeend">baselayerchangeend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L941" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L941" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:baselayerchangeend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    baselayerchangeend event, fired when base layer is changed.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">baselayerchangeend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L941">line 941</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:setbaselayer"><a href="#event:setbaselayer">setbaselayer</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L950" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L950" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:setbaselayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    setbaselayer event, fired when base layer is set.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">setbaselayer</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L950">line 950</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:baselayerload"><a href="#event:baselayerload">baselayerload</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L966" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L966" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:baselayerload" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    baselayerload event, fired when base layer is loaded.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">baselayerload</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L966">line 966</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:baselayerremove"><a href="#event:baselayerremove">baselayerremove</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L997" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L997" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:baselayerremove" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    baselayerremove event, fired when base layer is removed.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">baselayerremove</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L997">line 997</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:addlayer"><a href="#event:addlayer">addlayer</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1092" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1092" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:addlayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    addlayer event, fired when adding layers.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">addlayer</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>



            

            <td class="description last">layers to add</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1092">line 1092</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:removelayer"><a href="#event:removelayer">removelayer</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1154" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1154" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:removelayer" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    removelayer event, fired when removing layers.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">removelayer</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>layers</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Array.&lt;<a href="Layer.html">Layer</a>></span>


            
            </td>



            

            <td class="description last">layers to remove</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1154">line 1154</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:resize"><a href="#event:resize">resize</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1355" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1355" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:resize" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    resize event when map container's size changes
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">resize</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1355">line 1355</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:movestart"><a href="#event:movestart">movestart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1455" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1455" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:movestart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    movestart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">movestart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1455">line 1455</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:moving"><a href="#event:moving">moving</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1470" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1470" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:moving" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    moving event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">moving</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1470">line 1470</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:moveend"><a href="#event:moveend">moveend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1487" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1487" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:moveend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    moveend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">moveend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1487">line 1487</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:dragrotatestart"><a href="#event:dragrotatestart">dragrotatestart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1507" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1507" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:dragrotatestart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    dragrotatestart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">dragrotatestart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1507">line 1507</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:dragrotating"><a href="#event:dragrotating">dragrotating</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1522" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1522" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:dragrotating" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    dragrotating event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">dragrotating</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1522">line 1522</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:dragrotateend"><a href="#event:dragrotateend">dragrotateend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1538" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1538" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:dragrotateend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    dragrotateend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">dragrotateend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js">map/Map.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.js#L1538">line 1538</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:animating"><a href="#event:animating">animating</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L131" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L131" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:animating" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fired when map is animating.  (panning, zooming, rotating)
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">animating</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires the event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js">map/Map.Anim.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L131">line 131</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:animateinterrupted"><a href="#event:animateinterrupted">animateinterrupted</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L191" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L191" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:animateinterrupted" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fired when map's animation is interrupted by mouse event or else.
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">animateinterrupted</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires the event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js">map/Map.Anim.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L191">line 191</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:animateend"><a href="#event:animateend">animateend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L199" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L199" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:animateend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fired when map's animation ended (panning, zooming, rotating).
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">animateend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires the event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js">map/Map.Anim.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L199">line 199</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:animatestart"><a href="#event:animatestart">animatestart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L269" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L269" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:animatestart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fired when map starts to animate (panning, zooming, rotating).
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">animatestart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires the event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js">map/Map.Anim.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Anim.js#L269">line 269</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:pitch"><a href="#event:pitch">pitch</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L158" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L158" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:pitch" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    pitch event, alias of pitchend, deprecated
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">pitch</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>from</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">pitch from</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>to</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">pitch to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js">map/Map.Camera.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L158">line 158</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:pitchend"><a href="#event:pitchend">pitchend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L168" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L168" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:pitchend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    pitchend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">pitchend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>from</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">pitchend from</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>to</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">pitchend to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js">map/Map.Camera.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Camera.js#L168">line 168</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mousedown"><a href="#event:mousedown">mousedown</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L11" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L11" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mousedown" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mousedown event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mousedown</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L11">line 11</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mouseup"><a href="#event:mouseup">mouseup</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L23" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L23" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mouseup" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mouseup event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mouseup</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L23">line 23</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mouseover"><a href="#event:mouseover">mouseover</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L35" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L35" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mouseover" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mouseover event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mouseover</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L35">line 35</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mouseout"><a href="#event:mouseout">mouseout</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L47" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L47" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mouseout" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mouseout event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mouseout</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L47">line 47</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mouseenter"><a href="#event:mouseenter">mouseenter</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L59" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L59" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mouseenter" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mouseenter event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mouseenter</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L59">line 59</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mouseleave"><a href="#event:mouseleave">mouseleave</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L71" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L71" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mouseleave" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mouseleave event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mouseleave</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L71">line 71</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:mousemove"><a href="#event:mousemove">mousemove</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L83" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L83" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:mousemove" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    mousemove event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">mousemove</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L83">line 83</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:click"><a href="#event:click">click</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L95" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L95" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:click" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    click event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">click</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L95">line 95</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:dblclick"><a href="#event:dblclick">dblclick</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L107" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L107" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:dblclick" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    dblclick event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">dblclick</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L107">line 107</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:contextmenu"><a href="#event:contextmenu">contextmenu</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L119" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L119" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:contextmenu" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    contextmenu event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">contextmenu</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L119">line 119</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:keypress"><a href="#event:keypress">keypress</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L131" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L131" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:keypress" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    keypress event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">keypress</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L131">line 131</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchstart"><a href="#event:touchstart">touchstart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L143" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L143" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchstart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchstart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchstart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L143">line 143</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchmove"><a href="#event:touchmove">touchmove</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L155" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L155" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchmove" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchmove event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchmove</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L155">line 155</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchend"><a href="#event:touchend">touchend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L167" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L167" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>coordinate</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Coordinate.html">Coordinate</a></span>


            
            </td>



            

            <td class="description last">coordinate of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>containerPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">container point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>viewPoint</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">view point of the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>domEvent</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Event</span>


            
            </td>



            

            <td class="description last">dom event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js">map/Map.DomEvents.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.DomEvents.js#L167">line 167</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:fullscreenstart"><a href="#event:fullscreenstart">fullscreenstart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L22" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L22" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:fullscreenstart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fullscreenstart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">fullscreenstart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js">map/Map.FullScreen.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L22">line 22</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:fullscreenend"><a href="#event:fullscreenend">fullscreenend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L31" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L31" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:fullscreenend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    fullscreenend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">fullscreenend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js">map/Map.FullScreen.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L31">line 31</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:cancelfullscreen"><a href="#event:cancelfullscreen">cancelfullscreen</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L49" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L49" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:cancelfullscreen" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    cancelfullscreen event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">cancelfullscreen</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js">map/Map.FullScreen.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.FullScreen.js#L49">line 49</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:viewchange"><a href="#event:viewchange">viewchange</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L30" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L30" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:viewchange" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    viewchange event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">viewchange</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">map fires the event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>old</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Object</span>


            
            </td>



            

            <td class="description last">old view</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>new</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Point.html">Point</a></span>


            
            </td>



            

            <td class="description last">new view</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js">map/Map.ViewHistory.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.ViewHistory.js#L30">line 30</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:zoomstart"><a href="#event:zoomstart">zoomstart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L61" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L61" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:zoomstart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    zoomstart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">zoomstart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>from</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming from</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>to</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js">map/Map.Zoom.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L61">line 61</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:zooming"><a href="#event:zooming">zooming</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L107" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L107" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:zooming" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    zooming event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">zooming</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>from</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming from</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>to</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js">map/Map.Zoom.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L107">line 107</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:zoomend"><a href="#event:zoomend">zoomend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L127" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L127" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:zoomend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    zoomend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">zoomend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>from</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming from</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>to</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">Number</span>


            
            </td>



            

            <td class="description last">zoom level zooming to</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js">map/Map.Zoom.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/Map.Zoom.js#L127">line 127</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchactstart"><a href="#event:touchactstart">touchactstart</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L37" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L37" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchactstart" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchactstart event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchactstart</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js">map/handler/Map.Touch.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L37">line 37</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchacting"><a href="#event:touchacting">touchacting</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L91" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L91" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchacting" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchacting event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchacting</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js">map/handler/Map.Touch.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L91">line 91</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
            

    <!-- <h2>Constructor</h2> -->
    
    <li>
    
    <h4 class="name" id="event:touchactend"><a href="#event:touchactend">touchactend</a>
    
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L132" class="improvelink">[source]</a>
        
    
    <!-- 
        <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L132" class="improvelink">[help to improve]</a>
     -->
    <!-- <a href="#event:touchactend" class="improvelink">[link]</a> -->
    </h4>

    
    </li>
    
    




<div class="description">
    touchactend event
</div>




<!-- 
    <h5>Type:</h5>
    <ul>
        <li>
            
<span class="param-type">Object</span>


        </li>
    </ul>
 -->





<!-- event properties -->













    <h5 class="subsection-title">Properties:</h5>

    

<table class="props">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>



        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>type</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>



            

            <td class="description last">touchactend</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>target</code>
                    
                </td>
            

            <td class="type">
            
                
<span class="param-type"><a href="Map.html">Map</a></span>


            
            </td>



            

            <td class="description last">the map fires event</td>
        </tr>

    
    </tbody>
</table>



<dl class="details">

    

    

    

    

    

        

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        
            <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js">map/handler/Map.Touch.js</a>, <a target="_blank" href="https://github.com/maptalks/maptalks.js/tree/master/src/map/handler/Map.Touch.js#L132">line 132</a>
        

    </li></ul></dd>
    

    

    

    
</dl>



















<hr>
        
    
</article>

</section>




</div>

<nav class="page-nav">
    <h2><a href="index.html">V0.47.0</a></h2><h4>Classes</h4><ul></ul><h5>Map</h5><ul><li><a href="Map.html">Map</a></li></ul><h5>Layer</h5><ul><li><a href="Layer.html">Layer</a></li><li><a href="TileSystem.html">TileSystem</a></li><li><a href="TileLayer.html">TileLayer</a></li><li><a href="GroupTileLayer.html">GroupTileLayer</a></li><li><a href="WMSTileLayer.html">WMSTileLayer</a></li><li><a href="OverlayLayer.html">OverlayLayer</a></li><li><a href="VectorLayer.html">VectorLayer</a></li><li><a href="CanvasLayer.html">CanvasLayer</a></li><li><a href="ParticleLayer.html">ParticleLayer</a></li><li><a href="ImageLayer.html">ImageLayer</a></li></ul><h5>Geometry</h5><ul><li><a href="Geometry.html">Geometry</a></li><li><a href="Path.html">Path</a></li><li><a href="Marker.html">Marker</a></li><li><a href="TextMarker.html">TextMarker</a></li><li><a href="Label.html">Label</a></li><li><a href="TextBox.html">TextBox</a></li><li><a href="Polygon.html">Polygon</a></li><li><a href="LineString.html">LineString</a></li><li><a href="Curve.html">Curve</a></li><li><a href="ArcCurve.html">ArcCurve</a></li><li><a href="QuadBezierCurve.html">QuadBezierCurve</a></li><li><a href="CubicBezierCurve.html">CubicBezierCurve</a></li><li><a href="ConnectorLine.html">ConnectorLine</a></li><li><a href="ArcConnectorLine.html">ArcConnectorLine</a></li><li><a href="Ellipse.html">Ellipse</a></li><li><a href="Circle.html">Circle</a></li><li><a href="Sector.html">Sector</a></li><li><a href="Rectangle.html">Rectangle</a></li><li><a href="GeometryCollection.html">GeometryCollection</a></li><li><a href="MultiGeometry.html">MultiGeometry</a></li><li><a href="MultiPoint.html">MultiPoint</a></li><li><a href="MultiLineString.html">MultiLineString</a></li><li><a href="MultiPolygon.html">MultiPolygon</a></li><li><a href="GeoJSON.html">GeoJSON</a></li><li><a href="GeometryEditor.html">GeometryEditor</a></li></ul><h5>Basic types</h5><ul><li><a href="Coordinate.html">Coordinate</a></li><li><a href="Extent.html">Extent</a></li><li><a href="Point.html">Point</a></li><li><a href="PointExtent.html">PointExtent</a></li><li><a href="Position.html">Position</a></li><li><a href="Size.html">Size</a></li></ul><h5>Maptool</h5><ul><li><a href="MapTool.html">MapTool</a></li><li><a href="DrawTool.html">DrawTool</a></li><li><a href="DistanceTool.html">DistanceTool</a></li><li><a href="AreaTool.html">AreaTool</a></li></ul><h5>Ui</h5><ul><li><a href="ui.UIComponent.html">ui.UIComponent</a></li><li><a href="ui.UIMarker.html">ui.UIMarker</a></li><li><a href="ui.InfoWindow.html">ui.InfoWindow</a></li><li><a href="ui.ToolTip.html">ui.ToolTip</a></li><li><a href="ui.Menu.html">ui.Menu</a></li></ul><h5>Control</h5><ul><li><a href="control.Control.html">control.Control</a></li><li><a href="control.Zoom.html">control.Zoom</a></li><li><a href="control.LayerSwitcher.html">control.LayerSwitcher</a></li><li><a href="control.Attribution.html">control.Attribution</a></li><li><a href="control.Scale.html">control.Scale</a></li><li><a href="control.Panel.html">control.Panel</a></li><li><a href="control.Toolbar.html">control.Toolbar</a></li><li><a href="control.Overview.html">control.Overview</a></li></ul><h5>Core</h5><ul><li><a href="Ajax.html">Ajax</a></li><li><a href="Class.html">Class</a></li><li><a href="MapboxUtil.html">MapboxUtil</a></li><li><a href="Util.html">Util</a></li><li><a href="DomUtil.html">DomUtil</a></li><li><a href="StringUtil.html">StringUtil</a></li></ul><h5>Animation</h5><ul><li><a href="animation.Easing.html">animation.Easing</a></li><li><a href="animation.Frame.html">animation.Frame</a></li><li><a href="animation.Player.html">animation.Player</a></li><li><a href="animation.Animation.html">animation.Animation</a></li></ul><h5>Geo</h5><ul><li><a href="CRS.html">CRS</a></li><li><a href="measurer.Identity.html">measurer.Identity</a></li><li><a href="measurer.DEFAULT.html">measurer.DEFAULT</a></li><li><a href="measurer.Measurer.html">measurer.Measurer</a></li><li><a href="measurer.WGS84Sphere.html">measurer.WGS84Sphere</a></li><li><a href="measurer.BaiduSphere.html">measurer.BaiduSphere</a></li><li><a href="projection.DEFAULT.html">projection.DEFAULT</a></li><li><a href="projection.BAIDU.html">projection.BAIDU</a></li><li><a href="projection.EPSG3857.html">projection.EPSG3857</a></li><li><a href="projection.EPSG4326.html">projection.EPSG4326</a></li><li><a href="projection.EPSG4490.html">projection.EPSG4490</a></li><li><a href="projection.IDENTITY.html">projection.IDENTITY</a></li><li><a href="Transformation.html">Transformation</a></li></ul><h5>Handler</h5><ul><li><a href="Handler.html">Handler</a></li><li><a href="DragHandler.html">DragHandler</a></li></ul><h5>Other</h5><ul><li><a href="renderer.CanvasRenderer.html">renderer.CanvasRenderer</a></li></ul><h4>Namespaces</h4><ul><li><a href="measurer.html">measurer</a></li><li><a href="projection.html">projection</a></li><li><a href="renderer.html">renderer</a></li></ul><h4>Mixins</h4><ul><li><a href="Eventable.html">Eventable</a></li><li><a href="JSONAble.html">JSONAble</a></li><li><a href="measurer.Common.html">measurer.Common</a></li><li><a href="projection.Common.html">projection.Common</a></li><li><a href="Handlerable.html">Handlerable</a></li><li><a href="CenterMixin.html">CenterMixin</a></li><li><a href="TextEditable.html">TextEditable</a></li><li><a href="Renderable.html">Renderable</a></li><li><a href="ui.Menuable.html">ui.Menuable</a></li></ul><h3>Global</h3><ul><li><a href="global.html#INTERNAL_LAYER_PREFIX">INTERNAL_LAYER_PREFIX</a></li><li><a href="global.html#RESOURCE_PROPERTIES">RESOURCE_PROPERTIES</a></li><li><a href="global.html#RESOURCE_SIZE_PROPERTIES">RESOURCE_SIZE_PROPERTIES</a></li><li><a href="global.html#NUMERICAL_PROPERTIES">NUMERICAL_PROPERTIES</a></li><li><a href="global.html#COLOR_PROPERTIES">COLOR_PROPERTIES</a></li><li><a href="global.html#getListeningEvents">getListeningEvents</a></li><li><a href="global.html#isEmpty">isEmpty</a></li><li><a href="global.html#IS_NODE">IS_NODE</a></li><li><a href="global.html#identity">identity</a></li><li><a href="global.html#copy">copy</a></li><li><a href="global.html#set">set</a></li><li><a href="global.html#add">add</a></li><li><a href="global.html#subtract">subtract</a></li><li><a href="global.html#length">length</a></li><li><a href="global.html#normalize">normalize</a></li><li><a href="global.html#dot">dot</a></li><li><a href="global.html#scale">scale</a></li><li><a href="global.html#cross">cross</a></li><li><a href="global.html#distance">distance</a></li><li><a href="global.html#transformMat4">transformMat4</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.5</a> on Tue Feb 18 2020 16:21:06 GMT+0800 (GMT+08:00)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>

</body>
</html>